// pages/whjtubiao/whjtubiao.js

import * as echarts from '../../ec-canvas/echarts.js';

 
function initChart1(canvas, width, height, dpr) {
  const chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // new
  });
  canvas.setChart(chart);
 
  var option = {
    title: {
      text: '就业率',
      left: '5%'
    },
    color: ['#5087ec', '#85d0dc', '#58a55c'],
    legend: {
      data: ['C2109A班', 'C2109B班', 'C2109C班'],
      top: 50,
      left: 'center',
      z: 100
    },
    grid: {
      containLabel: true,
      top: '100'
    },
    tooltip: {
      show: true,
      trigger: 'axis'
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      data: ['C2109班'],
      // show: false
    },
    yAxis: {
      x: 'center',
      type: 'value',
      splitLine: {
        lineStyle: {
          type: 'solid'
        }
      }
      // show: false
    },
    series: [{
      name: 'C2109A班',
      type: 'bar',
      smooth: true,
      data: [80],
      barGap:0
    }, {
      name: 'C2109B班',
      type: 'bar',
      smooth: true,
      data: [60]
    }, {
      name: 'C2109C班',
      type: 'bar',
      smooth: true,
      data: [100]
    }]
  };
 
  chart.setOption(option);
  return chart;
}

function initChart2(canvas, width, height, dpr) {
  const chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // new
  });
  canvas.setChart(chart);
 
  var option = {
    title: {
      text: '就业质量',
      left: '5%'
    },
    color: ['#5087ec', '#85d0dc', '#58a55c'],
    legend: {
      data: ['C2109A班', 'C2109B班', 'C2109C班'],
      top: 50,
      left: 'center',
      z: 100
    },
    grid: {
      containLabel: true,
      top: '100'
    },
    tooltip: {
      show: true,
      trigger: 'axis'
    },
    xAxis: {
      x: 'center',
      type: 'value',
      splitLine: {
        lineStyle: {
          type: 'solid'
        }
      }


      // type: 'category',
      // boundaryGap: false,
      // data: ['C2109班'],
      // show: false
    },
    yAxis: {

      type: 'category',
      boundaryGap: false,
      data: ['C2109班'],


      // x: 'center',
      // type: 'value',
      // splitLine: {
      //   lineStyle: {
      //     type: 'solid'
      //   }
      // }
      // show: false
    },
    series: [{
      name: 'C2109A班',
      type: 'bar',
      smooth: true,
      data: [13000],
      barGap:0
    }, {
      name: 'C2109B班',
      type: 'bar',
      smooth: true,
      data: [12000]
    }, {
      name: 'C2109C班',
      type: 'bar',
      smooth: true,
      data: [12000]
    }]
  };
 
  chart.setOption(option);
  return chart;
}

function initChart3(canvas, width, height, dpr) {
  const chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // new
  });
  canvas.setChart(chart);
 
  var option = {
    title: {
      text: '环比上周',
      left: '5%'
    },
    color: ['#5087ec', '#85d0dc'],
    legend: {
      data: ['上周', '本周'],
      top: 50,
      left: 'center',
      z: 100
    },
    grid: {
      containLabel: true,
      top: '100'
    },
    tooltip: {
      show: true,
      trigger: 'axis'
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      data: ['周一','周二','周三','周四','周五'],
      // show: false
    },
    yAxis: {
      x: 'center',
      type: 'value',
      splitLine: {
        lineStyle: {
          type: 'solid'
        }
      }
      // show: false
    },
    series: [{
      name: '上周',
      type: 'line',
      smooth: false,
      data: [10,20,30,55,70]
    }, {
      name: '本周',
      type: 'line',
      smooth: false,
      data: [15,22,50,70,80]
    }]
  };
 
  chart.setOption(option);
  return chart;
}

function initChart4(canvas, width, height, dpr) {
  const chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // new
  });
  canvas.setChart(chart);
 
  var option = {
    title: {
      text: '面试量',
      left: '5%'
    },
    color: ['#5087ec', '#85d0dc', '#58a55c'],
    legend: {
      data: ['C2109A班', 'C2109B班', 'C2109C班'],
      top: 50,
      left: 'center',
      z: 100
    },
    grid: {
      containLabel: true,
      top: '100'
    },
    tooltip: {
      show: true,
      trigger: 'axis'
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      data: ['C2109班'],
      // show: false
    },
    yAxis: {
      x: 'center',
      type: 'value',
      splitLine: {
        lineStyle: {
          type: 'solid'
        }
      }
      // show: false
    },
    series: [{
      name: 'C2109A班',
      type: 'bar',
      smooth: true,
      data: [20],
      barGap:0
    }, {
      name: 'C2109B班',
      type: 'bar',
      smooth: true,
      data: [15]
    }, {
      name: 'C2109C班',
      type: 'bar',
      smooth: true,
      data: [30]
    }]
  };
 
  chart.setOption(option);
  return chart;
}







Page({

  /**
   * 页面的初始数据
   */
  data: {
    active:0,
    ec: {
      onInit: initChart1
    },
    ec2: {
      onInit: initChart2
    },
    ec3: {
      onInit: initChart3
    },
    ec4: {
      onInit: initChart4
    },
    list:{
      zhuanye:'短视频运营专业'
    },
    value2: 'a',
    option2: [
      { text: '当期', value: 'a' },
      { text: '2108', value: 'b' },
      { text: '2107', value: 'c' },
      { text: '2106', value: 'd' },
      { text: '2105', value: 'e' },
      { text: '2104', value: 'f' },
      { text: '半年内', value: 'g' },
      { text: '一年内', value: 'h' }
    ],
  },
  onChange(event){
    console.log("event:",event)
     this.setData({
       active: event.detail.index
     })
  },
  onClickLeft(){
    wx.navigateBack({
      delta: 1
    })
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})